<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./assets/css/reset.css">
    <link rel="stylesheet" href="./assets/css/index.css">
    <link rel="stylesheet" href="./assets/css/swiper-bundle.min.css">
</head>

<body>
    <!-- 导航 -->
    <div class="top">
        <div>首页</div>
    </div>
    <!-- 轮播图的优惠券 -->
    <div class="swiper mySwiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><a href="coupon-info.html"><img src="./assets/images/coupon.png" alt=""></a></div>
            <div class="swiper-slide"><a href="coupon-info.html"><img src="./assets/images/coupon.png" alt=""></a></div>
            <div class="swiper-slide"> <a href="coupon-info.html"><img src="./assets/images/coupon.png" alt=""></a></div>
        </div>
        <div class="swiper-pagination"></div>
    </div>

    <div class="hotel_search">
        <input type="text" placeholder="请输入关键词搜索">
        <div class="screen_icon">
            <img src="./assets/images/screen.png" alt="">
        </div>
    </div>

    <div class="hotellist">
        <div class="item">
            <a href="detail.html">
                <!-- <div class="collect">
                    <img src="./assets/images/heart.png" alt="">
                </div> -->
                <!-- <div class="type_name">新房特惠</div> -->
                <div class="images">
                    <div class="swipers">
                        <img src="./assets/images/hotel1.jpg" alt="">
                    </div>
                    <div class="title">暑假特价房</div>
                </div>
                <div>
                    <div class="item_top">
                        <span>推广优惠</span>
                        <span>月租惠选</span>
                        <span>满减优惠</span>
                        <span>节假日优惠</span>
                    </div>
                    <div class="item_bot">
                        <div class="font">
                            <span class="price">￥60.00/晚</span>
                            <span class="market_price">￥80.00/晚</span>
                        </div>
                        <div class="btn">立即预定</div>
                    </div>
                </div>
            </a>
        </div>
        <div class="item">
            <a href="detail.html">
                <!-- <div class="collect">
                    <img src="./assets/images/heart.png" alt="">
                </div> -->
                <!-- <div class="type_name">新房特惠</div> -->
                <div class="images">
                    <div class="swipers">
                        <img src="./assets/images/hotel1.jpg" alt="">
                    </div>
                    <div class="title">暑假特价房</div>
                </div>
                <div>
                    <div class="item_top">
                        <span>推广优惠</span>
                        <span>月租惠选</span>
                        <span>满减优惠</span>
                        <span>节假日优惠</span>
                    </div>
                    <div class="item_bot">
                        <div class="font">
                            <span class="price">￥60.00/晚</span>
                            <span class="market_price">￥80.00/晚</span>
                        </div>
                        <div class="btn">立即预定</div>
                    </div>
                </div>
            </a>
        </div>
        <div class="item">
            <a href="detail.html">
                <!-- <div class="collect">
                    <img src="./assets/images/heart.png" alt="">
                </div> -->
                <!-- <div class="type_name">新房特惠</div> -->
                <div class="images">
                    <div class="swipers">
                        <img src="./assets/images/hotel1.jpg" alt="">
                    </div>
                    <div class="title">暑假特价房</div>
                </div>
                <div>
                    <div class="item_top">
                        <span>推广优惠</span>
                        <span>月租惠选</span>
                        <span>满减优惠</span>
                        <span>节假日优惠</span>
                    </div>
                    <div class="item_bot">
                        <div class="font">
                            <span class="price">￥60.00/晚</span>
                            <span class="market_price">￥80.00/晚</span>
                        </div>
                        <div class="btn">立即预定</div>
                    </div>
                </div>
            </a>
        </div>
    </div>

    <div class="hotel_more">
        没有更多了
    </div>

    <div style="height: 55px;"></div>

    <div class="footer">
        <a class="item active" href="index.html">
            <div class="item_img">
                <img src="./assets/images/order.png" alt="">
            </div>
            <div class="title">首页</div>
        </a>
        <a class="item" href="user.html">
            <div class="item_img">
                <img src="./assets/images/order.png" alt="">
            </div>
            <div class="title">我的</div>
        </a>
    </div>
</body>

</html>
<script src="./assets/js/swiper-bundle.min.js"></script>
<script>
    var swiper = new Swiper(".mySwiper", {
        spaceBetween: 30,
        autoplay: true,
        loop: true,
        pagination: {
            el: ".swiper-pagination",
            clickable: true,
        },
    });
</script>